<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/page/common/public.jspf"%>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="${skin}/v1.min.css?v=${v}" />
<link rel="stylesheet" type="text/css" href="${skin}/help_web2.css?v=${v}" />
<link rel="stylesheet" type="text/css" href="${skin}/index.css?v=${v}" />
<script type="text/javascript" src="${path }/js/jquery1.10.2.min.js?v=${v}"></script>
<script type="text/javascript" src="${path }/js/v1.min.js"></script>
<title>${configUtil.sitename}-利率计算器</title>
</head>

<body>
<!-- head -->
<c:import url="../../include/top.jsp"></c:import>

<div class="wrap">
<div class="blank"></div>
<div class="clearfix">
    <div class="short_uc fl">
        <div class="comm2_top"></div>
        <div class="comm2_con">
			 <c:import url="../../home/left.jsp"></c:import> 
        </div>
        <div class="comm2_bot"></div>
    </div>
    <div class="inc_box fr">
        <div class="comm_top"></div>
        <div class="comm_con">
            <div class="inc">
               <div class="xf_about_contet" id="content">
<h3 class="xf_mem_accout_title">利率计算器</h3>
<div class="xf_mem_jsq_xyjsq">
	<div class="xf_mem_jsq_hk_t">
		<table border="0" cellpadding="0" cellspacing="0" width="739" class="xf_mem_jsq_hk_table">
			<tbody><tr>
				<td class="xf_mem_jsq_hk_tdl">投标金额：</td>
				<td class="xf_mem_jsq_hk_tdr">
				<input class="xf_mem_jsq_hk_input" type="text" id="amount" onkeyup="value=value.replace(/[^\d]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d  |^\.]/g,''))">
				&nbsp;元
				</td>
			</tr>
			<tr>
				<td class="xf_mem_jsq_hk_tdl">年利率：</td>
				<td class="xf_mem_jsq_hk_tdr">
				<input class="xf_mem_jsq_hk_input" type="text" id="apr" onkeyup="value=value.replace(/[^\d\.]/g, '').replace(/(\.\d{2}).*/g, '$1')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d  |^\.]/g,''))">
				&nbsp;%
				</td>
			</tr>
			<tr>
				<td class="xf_mem_jsq_hk_tdl">投标期限：</td>
				<td class="xf_mem_jsq_hk_tdr">
				<input class="xf_mem_jsq_hk_input" type="text" id="period" onkeyup="value=value.replace(/[^\d]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d  |^\.]/g,''))" onblur="checkPeriod()">&nbsp;
					<select id="periodUnit" onchange="test()"> 
						<option value="-1">年</option>
						<option value="0">月</option>
						<option value="1">日</option>
					</select>
				</td>
			</tr>
			<tr>
				<td class="xf_mem_jsq_hk_tdl">还款方式：</td>
				<td class="xf_mem_jsq_hk_tdr">
					<select name="xf_memhkjsq_selectAge" class="xf_memhkjsq_selectAge" id="repaymentType">   
						
							
							 <option value="1">按月还款、等额本息</option>  
							
						
							
							 <option value="2">按月付息、到期还本</option>  
							
						
							
							 <option value="3">一次性还款</option>  
							
						
					</select>
				</td>
			</tr>
			<tr>
				<td rowspan="2" class="xf_mem_jsq_hk_tdl">投标奖励：</td>
				<td class="xf_mem_jsq_hk_tdr">
				<input class="xf_mem_jsq_hk_input" type="text" id="awardScale" onkeyup="value=value.replace(/[^\d\.]/g, '').replace(/(\.\d{2}).*/g, '$1')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d  |^\.]/g,''))">&nbsp;%</td>
			</tr>
			<tr>
				<td class="xf_mem_jsq_hk_tdr">
				<input class="xf_mem_jsq_hk_input" type="text" id="bonus" onkeyup="value=value.replace(/[^\d\.]/g, '').replace(/(\.\d{2}).*/g, '$1')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d  |^\.]/g,''))">&nbsp;元</td>
			</tr>
		</tbody></table>
	</div>
	<div class="xf_mem_jsq_xyjsq_go">
		<a class="xf_con_inputfbjk" onclick="calculate();">计 算</a>
	</div>
	<!-- 计算结果 -->
	<div class="xf_mem_jsq_hk_c xf_mem_jsq_lv_c" id="showResult" style="display: none;">
		<table border="0" cellpadding="0" cellspacing="0" width="739" class="xf_mem_jsq_hk_ctble">
			<tbody><tr>
				<td class="xf_mem_jsq_hk_ctitle" height="52" colspan="2">计算结果</td>
			</tr>
			<tr>
				<td class="xf_mem_jsq_hk_tdl" width="202">投标总额：</td>
				<td class="xf_mem_jsq_hk_tdr">
				<span class="xf_mem_jsq_red" id="totalAmount"></span>&nbsp;元
				</td>
			</tr>
			
			<tr>
				<td class="xf_mem_jsq_hk_tdl">总计利息：</td>
				<td class="xf_mem_jsq_hk_tdr">
					<span class="xf_mem_jsq_red" id="sumInterest"></span>&nbsp;元
				</td>
			</tr>
			<tr>
				<td class="xf_mem_jsq_hk_tdl">投标奖励：</td>
				<td class="xf_mem_jsq_hk_tdr">
					<span class="xf_mem_jsq_red" id="award"></span>&nbsp;元
				</td>
			</tr>
			<tr>
				<td class="xf_mem_jsq_hk_tdl">
					<span id="monthText"></span>
				</td>
				<td class="xf_mem_jsq_hk_tdr">
					<span class="xf_mem_jsq_red" id="monthSum"></span>&nbsp;元
				</td>
			</tr>
			<tr>
				<td class="xf_mem_jsq_hk_tdl">	
					<span id="sumEarningText"></span>
				</td>
				<td class="xf_mem_jsq_hk_tdr">
					<span class="xf_mem_jsq_red" id="sumEarning"></span>&nbsp;元
				</td>
			</tr>
		</tbody></table>
	</div>
</div>

<script type="text/javascript">
<!--
	$(function(){
		$("#showResult").hide();

		$("#apr").focus(function(){
			this.value = "";
		});
		
		$("#amount").focus(function(){
			this.value = "";
		});
		
		$("#period").focus(function(){
			this.value = "";
		});

		$("#awardScale").focus(function(){
			this.value = "";
			$("#bonus").val("");
		});

		$("#bonus").focus(function(){
			this.value = "";
			$("#awardScale").val("");
		}); 
	})
	
	/* 投标期限为天只能为一次性还款 */
	function test(){
		var periodUnitVal = $("#periodUnit").val() * 1;
		var repaymentType = $("#repaymentType");
		
		repaymentType.html("");
		if(1 == periodUnitVal){
			
				
			
				
			
				
					repaymentType.append("<option value=3>一次性还款</option>");
				
			
		}else{
			
				
					repaymentType.append("<option value=1>按月还款、等额本息</option>");
				
			
				
					repaymentType.append("<option value=2>按月付息、到期还本</option>");
				
			
				
					repaymentType.append("<option value=3>一次性还款</option>");
				
			
		}
	}
	
	/* 当投标期限选择为日时，只能为30天以下（包括30） */
	function checkPeriod(){
		var periodUnit = $("#periodUnit");
		var period = $("#period");
		var periodVal = period.val();

		if(1 == periodUnit.val() && periodVal > 30){
			alert("天标借款期限不能大于30天！");
		}
	}
	
	function calculate(){
		var amount = $("#amount").val() * 1;
		var apr = $("#apr").val() * 1;
		var period = $("#period").val() * 1;
		var periodUnit = $("#periodUnit").val() * 1;
		var repaymentType = $("#repaymentType").val() * 1;
		var awardScale = $("#awardScale").val() * 1;
		var bonus = $("#bonus").val() * 1;

		if(amount<= 0 || amount>100000000 || isNaN(amount)){
			$("#amount").val("金额有误!");
			$("#showResult").hide();
			return;
		}
			
		if(apr > 100 || apr <= 0 || isNaN(apr)){
			$("#apr").val("年利率有误!");
			$("#showResult").hide();
			return;
		}
		
		if(period<1 || period >1000 || isNaN(period)){
			$("#period").val("期限有误!");
			$("#showResult").hide();
			return;
		}
		
		if(1 == periodUnit && period > 30){
			alert("天标借款期限不能大于30天！");
			return ;
		}

		var award = 0;
		
		if(awardScale > 100 || awardScale < 0){
			$("#awardScale").val("奖励比例有误!");
			return;
		}else if(awardScale != 0){
			award = amount * awardScale / 100;
		}

		if(bonus< 0 || bonus>amount){
			$("#bonus").val("固定奖励有误!");
			return;
		}else if(bonus != 0){
			award = bonus;
		}

		var interest = 0; // 年、月、日 年利率
		var monthApr = apr / 12 / 100; // 月利率
		var rperiod = 0; // 还款期数
		
		/* 根据借款期限算出利息 */
		switch(periodUnit){
			/* 年 */
			case -1:
				interest = apr/100*period*amount;
				rperiod = period * 12; 
				break;
			/* 月 */
			case 0: 
				interest = apr/12/100*period*amount;
				rperiod = period; 
				break;
			/* 日 */
			case 1: 
				interest = apr/360/100*period*amount;
				rperiod = 1; 
				break;
		}
		
		var monthSum = 0;
		var monthText = $("#monthText");
		
		/* 根据还款方式算出利息 */
		switch(repaymentType){
			/* 按月还款、等额本息 */
			case 1: 
				monthSum = (amount * monthApr * Math.pow((1 + monthApr), rperiod)) / (Math.pow((1 + monthApr), rperiod) - 1); 
				interest = monthSum * rperiod - amount;
				monthText.html("月还本息:"); 
				break;
				
			/* 按月付息、一次还款 */
			case 2:
				monthText.html("月还利息:"); 
				monthSum = interest / rperiod;
			 	break;
			 	
			/* 一次还款 */
			case 3: 
				monthText.html("应还本息:");
				monthSum = interest + amount;
				break;
		}

		/* 年化收益、总收益 */
		var listAction = function(options) {var pattern = '/front/homeAction/aprCalculator?repaymentType=:repaymentType&amount=:amount&apr=:apr&award=:award&rperiod=:rperiod'; for(var key in options) { pattern = pattern.replace(':'+key, options[key] || ''); } return pattern }
;
		$.post(listAction({amount:amount, apr:apr,repaymentType:repaymentType,award:award,rperiod:rperiod}), function(data) {
			//$("#earning").html(data.earning); //年化收益  
			var serviceFee = data.managementRate * interest;
			$("#sumEarningText").html("总收益(扣除" + serviceFee.toFixed(2) + "元服务费)："); // 总收益提示
			$("#sumEarning").html((amount + interest + award - serviceFee).toFixed(2)); // 总收益
		});
		
		$("#totalAmount").html(amount); //金额
		$("#sumInterest").html(interest.toFixed(2)); //总计利息
		$("#award").html(award.toFixed(2)); //投标奖励
		$("#monthSum").html(monthSum.toFixed(2)); // 每月还款
		$("#sumEarning").html(); 
		
		$("#showResult").show(); // 计算结果层
	}
//-->
</script>
				</div>
                <div class="inc_foot"></div>
            </div>
        </div>
        <div class="comm_bot"></div>
    </div>
</div>
<div class="blank"></div>
</div>





<c:import url="../../include/foot.jsp"></c:import>
</body>
</html>